<template>
    <div class="app-container">
        <el-table :data="managers" border fit highlight-current-row>
            <el-table-column prop="_id" label="ID"></el-table-column>
            <el-table-column prop="realname" label="名称"></el-table-column>
            <el-table-column prop="account" label="账户"></el-table-column>
            <el-table-column prop="telephone" label="联系方式"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" type="danger" @click.native.prevent="delManagerById(scope.row._id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <!-- <el-pagination
            :current-page="page.current"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="page.size"
            layout="total, sizes, prev, pager, next, jumper"
            :total="managers.length">
        </el-pagination> -->
    </div>
</template>

<script>
import {_listAdmins, _delAdmin} from '@/api/admin';

export default {
    name: 'ManagerList',
    data() {
        return {
            managers: [],
            page: {
                current: 1,
                size: 10
            }
        };
    },
    mounted() {
        this.refreshManagers();
    },
    methods: {
        /**
         * 刷新管理员列表
         */
        async refreshManagers() {
            const {message} = await _listAdmins();
            this.managers = message || [];
        },
        /**
         * 根据id删除
         */
        async delManagerById(id) {
            const {msg} = await _delAdmin({_id: id});
            this.refreshManagers();
            this.$message.success(msg);
        }
    }
};
</script>
